<template>
  <div>子组件标题： {{ title }}</div>
  <div class="child-first">序号：{{ i }}</div>

</template>
<script>
export default {
  name: 'child',
  //   将data中的本地变量升级为属性变量 由父组件操控
  props: {
    i: {
      type: Number,
      default: 0
    },
    title: {
      type: String,
      default: '----'
    }
  },
  data() {
    return {
      //   index: 11
    }
  },
  methods: {}
}
</script>
<style>
.child-first {
  background-color: red;
  width: 100px;
}
</style>
